{% extends 'proyectos/base.html' %}

{% block panelizq %}
    <h3>Contenido</h3>
    <ul class="menuv-dropdown dropdown-vertical" id="nav">
        <li class="item-102"><a href="/proyectos/">Mis Proyectos</a></li>
        <li class="item-102 current active"><a href="/grupos/editar/{{ grupo.id }}">Editar Grupo</a></li>
        <li class="item-102"><a href="/grupos/">Mis Grupos</a></li>
        <li class="item-119"><a href="/grupos/crear/">Crear Grupo</a></li>
    </ul>
{% endblock panelizq %}

{% block content %}
	<div id="contact_wrap">
		<div class="nav-section">
			<ul></ul>
		</div>
		<div id="contact" class="round clearfix">
			<div id="contact-form">
				<h2 style="text-align: center;">Editar Grupo</h2>
				<form action="/grupos/editar/{{ grupo.id }}" method="POST">
					{% csrf_token %}
					{{ form.as_table }} <br/>

					<input type="submit" value="Guardar Cambios" style="margin-left: 95px;"/>
				</form>

				<form action="/grupos/borrar/{{ grupo.id }}" method="POST">
					{% csrf_token %}
					<input type="submit" value="Borrar Grupo" style="margin-left: 111px;"/>
				</form>

				<form action="/grupos/" method="GET">
					<input type="submit" value="Volver" style="margin-left: 137px;"/>
				</form>
			</div>
		</div>
	</div>

    <script type="text/javascript">
        $("#id_miembros").sexyselect({showTitle:false,allowInput:false,allowFilter:true,allowDelete:false,selectionMode:'multiple',width:330});
    </script>
{% endblock content %}
